<!DOCTYPE html>
<html>

<head>
	<meta charset="utf-8">
	<title>预订界面</title>

	<link rel="stylesheet" href="./static/css/details.css" />
	<link rel="stylesheet" href="./static/css/detail2.css" />
	<link rel="stylesheet" href="./static/css/entry.css" />

	<!-- 导航条 -->
	<!-- <link rel="stylesheet" href="./static/css/bootstrap.css"> -->
	<!-- 页面位置-->
	<link rel="stylesheet" href="static/css/bootstrap.min.css">
	<!-- 首页分页图标以及箭头 -->
	<link rel="stylesheet" href="static/css/boxicons.min.css">
	<!-- 小图标 -->
	<link rel="stylesheet" href="static/css/remixicon.css">
	<!-- 页面css 动画效果-->
	<link rel="stylesheet" href="static/css/owl.carousel.min.css">

	<!-- 页面头部 -->
	<link rel="stylesheet" href="static/css/style.css">
	<!-- 组件 -->
	<link rel="stylesheet" href="static/css/dark-theme.css">
	<link rel="stylesheet" href="./static/css/add.css">




</head>

<body>

	<!-- 头部 -->
	<!-- 预加载器区域 -->
	<div class="preloader-style" id="loader-style">
		<div class="preloader-wrap">
			<div class="preloader-container">
				<div class="petal"></div>
				<div class="petal"></div>
				<div class="petal"></div>
				<div class="petal"></div>
				<div class="petal"></div>
				<div class="petal"></div>
				<div class="ball"></div>
			</div>
		</div>
	</div>
	<!-- 预加载器区域 -->

	<!-- 主题切换器 -->
	<div class="switch-theme-mode">
		<label id="switch" class="switch">
			<input type="checkbox" onchange="toggleTheme()" id="slider">
			<span class="slider round"></span>
		</label>
	</div>

	<div class="page-wrapper">

		<!-- 导航条开始 -->
		<header class="header-wrap">
			<div class="header-top">
				<div class="container">
					<div class="row align-items-center">
						<div class="col-xl-7 col-lg-6 col-md-6">
							<div class="header-top-left">
								<ul class="contact-info list-style">
									<li>
										<i class="bx bx-phone-call"></i>
										<a href="tel:+12345678999">+12 345 678 999</a>
									</li>
									<li>
										<i class="bx bx-envelope"></i>
										<a href="mailto:hello@example.com">hello@example.com</a>
									</li>
									<li>
										<i class="bx bx-location-plus"></i>
										<p>123 Western Road Melbourne, UK.</p>
									</li>
								</ul>
							</div>
						</div>
						<div class="col-xl-5 col-lg-6 col-md-6">
							<div class="header-top-right">
								<ul class="social-profile list-style style1">
									<li>
										<a href="#">
											<i class="ri-facebook-fill"></i>
										</a>
									</li>
									<li>
										<a href="#">
											<i class="ri-twitter-fill"></i>
										</a>
									</li>
									<li>
										<a href="#">
											<i class="ri-instagram-line"></i>
										</a>
									</li>
									<li>
										<a href="#">
											<i class="ri-linkedin-fill"></i>
										</a>
									</li>
								</ul>
								<div class="select-lang">
									<i class="ri-earth-fill"></i>
									<div class="navbar-option-item navbar-language dropdown language-option">
										<button class="dropdown-toggle" type="button" data-bs-toggle="dropdown"
											aria-haspopup="true" aria-expanded="false">
											<span class="lang-name"></span>
										</button>
										<div class="dropdown-menu language-dropdown-menu">
											<a class="dropdown-item" href="#">
												<img src="static/picture/us.jpg" alt="flag">
												Eng
											</a>
											<a class="dropdown-item" href="#">
												<img src="static/picture/germany.jpg" alt="flag">
												Ger
											</a>
											<a class="dropdown-item" href="#">
												<img src="static/picture/france.jpg" alt="flag">
												Fra
											</a>
											<a class="dropdown-item" href="#">
												<img src="static/picture/spain.jpg" alt="flag">
												Spa
											</a>
											<a class="dropdown-item" href="#">
												<img src="static/picture/russia.jpg" alt="flag">
												Rus
											</a>
											<a class="dropdown-item" href="#">
												<img src="static/picture/italy.jpg" alt="flag">
												Ita
											</a>
										</div>
									</div>
								</div>
								<div class="user-account">
									<i class="ri-account-box-line"></i>
									<!-- 跳转登录 -->
									<a href="login.html">登录</a>/
									<a href="signup.html">注册</a>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
			<div class="header-bottom">
				<div class="container">
					<nav class="navbar navbar-expand-md navbar-light">
						<a class="navbar-brand" href="#">
							<img class="logo-light" src="./static/image/combined_logo.jpg" id="logo" alt="logo">
						</a>
						<div class="collapse navbar-collapse main-menu-wrap" id="navbarSupportedContent">
							<div class="menu-close d-lg-none">
								<a href="javascript:void(0)"> <i class="ri-close-line"></i></a>
							</div>
							<ul class="navbar-nav ms-auto">
								<li class="nav-item">
									<a href="index.html" class="nav-link">
										首页
										<i class="ri-add-line"></i>
									</a>
								</li>
								<li class="nav-item">
									<a href="list.html" class="nav-link active">
										酒店
									</a>
								</li>
								<li class="nav-item">
									<a href="#" class="nav-link">
										攻略
										<i class="ri-add-line"></i>
									</a>

								</li>
								<li class="nav-item">
									<a href="#section1" class="nav-link">
										城市推荐
										<i class="ri-add-line"></i>
									</a>
								</li>

								<li class="nav-item">
									<a href="savecenter.html" class="nav-link">
										加盟中心
										<i class="ri-add-line"></i>
									</a>
								</li>
								<li class="nav-item">
									<a href="Me.html" class="nav-link">
										个人中心
									</a>
								</li>
								<li class="nav-item d-lg-none">
									<a href="list.html" class="nav-link btn style1">搜索</a>
								</li>
							</ul>
							<div class="other-options md-none">
								<div class="option-item">
									<button class="searchbtn d-xl-none"><i class="ri-search-line"></i></button>
									<div class="searchbox lg-none">
										<form action="#" method="post">
											<input type="search" placeholder="请输入...">
											<a href="#"><i class="bx bx-search"></i></a>
										</form>
									</div>
								</div>
								<div class="option-item">
									<a href="list.html" class="btn style1">搜索</a>
								</div>
							</div>
						</div>
					</nav>
					<div class="search-area">
						<form action="#" method="post">
							<input type="search" placeholder="请输入">
							<a href="#"><i class="ri-search-line"></i></a>
						</form>
					</div>
					<div class="mobile-bar-wrap">
						<button class="searchbtn d-lg-none"><i class="ri-search-line"></i></button>
						<div class="mobile-menu d-lg-none">
							<a href="javascript:void(0)"><i class="ri-menu-line"></i></a>
						</div>
					</div>
				</div>
			</div>
		</header>
		<!-- 导航条结束 -->



		<!--每个组件实例都会有一个唯一的 data-v-* 属性值，确保样式不会影响到其他组件-->
		<div class="book-content" id="book-content" data-v-b39eaf58=""><!--整体大盒子-->
			<!--左侧预定信息板块的盒子-->
			<div class="info-content" data-v-7a97a6d4="">
				<div data-v-7a97a6d4="">
					<!--你的选择 预定信息 最后一步-->
					<div data-v-3974ab66="" data-v-7a97a6d4="" class="step-content"><!--步骤内容-->
						<div data-v-3974ab66="" class="circle " id="one">1</div>
						<div data-v-3974ab66="" class="text active">您的选择</div>
						<div data-v-3974ab66="">
							<svg data-v-3974ab66 class="svg-icon icon-next next next" style="color: rgb(17, 17, 17);">
								<use xlink:href="#icon-next"></use>
							</svg>>
						</div>
						<div data-v-3974ab66="" class="circle " id="two">2</div>
						<div data-v-3974ab66="" class="text active">个人信息</div>
						<div data-v-3974ab66=""><svg data-v-3974ab66="" class="svg-icon icon-next next next"
								style="color: rgb(17, 17, 17);">
								<use xlink:href="#icon-next"></use>
							</svg>></div>
						<div data-v-3974ab66="" class="circle">3</div>
						<div data-v-3974ab66="" class="text">最后一步</div>
					</div>

					<!--预订信息-->
					<h1 class="flex" data-v-7a97a6d4="">预订信息 <span class="top-information ml-[10px]" data-v-7a97a6d4="">
							<!--订房必读-->
							<div data-v-620352a5="" data-v-7a97a6d4="" class="facBooking">
								<div data-v-620352a5="" class="head bbl" style="">
									<p data-v-620352a5="" class="book_cxy"><i data-v-620352a5="" class="fjth"></i><span
											data-v-620352a5="" class="lightTxt" style="">房价特惠</span>现在下单立省103元，赶紧预订吧</p>
									<p data-v-620352a5="" class="book_cxy"><i data-v-620352a5="" class="fyjz"></i><span
											data-v-620352a5="" class="lightTxt" style="">房源紧张</span>此房型只剩最后3间，手速要快</p>
									<p data-v-620352a5="" class="book_cxy"><i data-v-620352a5="" class="zwbl"></i><span
											data-v-620352a5="" class="lightTxt" style="color:#ad58eb ;"">整晚保留</span>预订成功后房间将为您保留整晚</p>
									<p data-v-620352a5="" class=" book_cxy"><i data-v-620352a5="" class="fjth"></i><span data-v-620352a5=""
												class="lightTxt" style="">房价特惠</span>现在下单立省103元，赶紧预订吧</p>
								</div>
							</div>
						</span></h1>
					<div data-v-7a97a6d4="" class="hi-readme flex mb-[10px]"><span data-v-7a97a6d4=""
							class="w-[64px] font-[700] hi-readme-btn" style="color:#ad58eb ;">订房必读:</span>
						<div data-v-7a97a6d4="" class="flex-[1] hi-readme-txt">&nbsp;&nbsp;入住时间：14:00后 退房时间：12:00前
						</div>
						<span data-v-7a97a6d4="" class="w-[60px] cursor-pointer" data-events="click">查看更多</span>
					</div><!----><!---->
					<!--订房必读下方的下划线-->
					<hr class="hr mb-[16px]" data-v-7a97a6d4="">
					<!--入住信息-->
					<div class="guestInfo" data-v-7a97a6d4="">
						<h2 data-v-7a97a6d4="">入住信息</h2>
						<dl class="clearfix mb-[16px]" data-v-7a97a6d4="">
							<dt class="fl w-56" data-v-7a97a6d4="">入离日期</dt>
							<dd class="fl time" data-v-7a97a6d4="">
								<div class="room-info" data-v-7a97a6d4="">
									<div class="bed-info flex items-center" data-v-7a97a6d4="">
										<div class="flex flex-col" data-v-7a97a6d4="">
											<div class="text-[#111] text-[14px] leading-none checkMouthDayStr"
												data-v-7a97a6d4="">
												11月09日
												今天</div>
											<div class="text-[#111] opacity-50 mt-[8px] leading-none text-[12px]"
												data-v-7a97a6d4="">14:00之后</div>
										</div>
										<div class="flex days items-center mx-[10px] h-[24px] px-[4px] leading-none bg-[#F5F5F5] rounded-[2px]"
											data-v-7a97a6d4="">1 晚</div>
										<div class="flex flex-col" data-v-7a97a6d4="">
											<div class="text-[#111] text-[14px] leading-none leaveMouthDayStr"
												data-v-7a97a6d4="">
												11月10日
												明天</div>
											<div class="text-[#111] opacity-50 mt-[8px] leading-none text-[12px]"
												data-v-7a97a6d4="">12:00之前</div>
										</div>
									</div><!---->
								</div>
							</dd>
						</dl><!----><!---->
						<div class="rooms" data-v-7a97a6d4="">
							<div class="w-56" data-v-7a97a6d4="">房间数</div>
							<select name="roomnumber" class="xuanze">
								<option value="1">请选择</option>
								<option value="1">1</option>
								<option value="2">2</option>
								<option value="3">3</option>
								<option value="4">4</option>
								<option value="5">5</option>
								<option value="6">6</option>
								<option value="7">7</option>
								<option value="8">8</option>
							</select>
							<!-- <div class="selectRooms" data-v-7a97a6d4="" data-events="click">
									<svg class="svg-icon icon-book_arrow_down" style="" data-v-7a97a6d4="">
										<use xlink:href="#icon-book_arrow_down"></use>
									</svg>
								</div> -->
							<div class="w-[290px] ml-[10px]" data-v-7a97a6d4=""><em class="roomTips"
									data-v-7a97a6d4="">（最后的机会，仅剩3间）</em></div>
						</div><!--[--><!--[-->
						<ul class="ul" data-v-7a97a6d4=""><!--[-->
							<li class="li" data-v-7a97a6d4="">
								<div class="w-56" style="line-height:34px;" data-v-7a97a6d4="">入住人</div>
								<div class="singleRoomBox" data-v-7a97a6d4="">
									<div class="singleRoom" style="column-gap:unset;flex-direction:column;"
										data-v-7a97a6d4="">
										<div style="display:flex;column-gap:5px;align-items:center;justify-content:flex-start;"
											data-v-7a97a6d4=""><input type="text" autocomplete="false" class="ipt new"
												value="" placeholder="每间只需填一人" data-v-7a97a6d4="" data-events="click">
										</div><!---->
									</div>
								</div>
							</li><!--]-->
						</ul><!----><!----><!--]--><!----><!--]-->
						<div class="mail-phone" data-v-7a97a6d4="">
							<div data-v-adab5149="" style="line-height:34px;" class="w-56" data-v-7a97a6d4=""> 联系电话
							</div>
							<div class="singleRoomBox" data-v-7a97a6d4="">
								<div class="singleRoom" data-v-7a97a6d4="">
									<div style="display:flex;width:100%;align-items:center;" data-v-7a97a6d4="">
										<div class="phoneLocal" style="text-align:center;" data-v-7a97a6d4=""
											data-events="click">
											<div class="text-ellipsis" data-v-7a97a6d4=""> +86</div>
											<div class="svg-flex" data-v-7a97a6d4=""><svg
													class="svg-icon icon-book_arrow_down" style="color:;width:;height:;"
													data-v-7a97a6d4="">
													<use xlink:href="#icon-book_arrow_down"></use>
												</svg></div>
										</div>
										<div style="flex:1;" data-v-7a97a6d4=""><input class="ipt2" value=""
												placeholder="电话号码" data-v-7a97a6d4="" data-events="click"></div>
									</div>
								</div>
							</div>
						</div><!----><!----><!----><!----><!----><!----><!----><!---->
					</div>
					<!--取消政策部分-->
					<section class="Cancellation mt-[40px]" data-v-7a97a6d4="">
						<h2 data-v-7a97a6d4="">取消政策</h2><span data-v-7a97a6d4="" class="cancellation-tips"><svg
								data-v-7a97a6d4="" class="svg-icon icon-icon-cancel cancel cancel">
								<use xlink:href="#icon-icon-cancel"></use>
							</svg> 入住日18点前免费取消</span><!---->
						<div data-v-66eb597a="" data-v-7a97a6d4="" class="food-hover-box">
							<div data-v-66eb597a="" class="food-hover">
								<div data-v-66eb597a="" class="arrow-up"></div>
								<div data-v-66eb597a="" class="table-info"
									style="max-width: unset; overflow-x: hidden;">
									<div data-v-66eb597a="" class="table-info-header"><!---->
										<div data-v-66eb597a="" class="t-content">北京时间</div>
										<div data-v-66eb597a="" class="t-content">取消&amp;修改费用</div>
									</div>
									<div data-v-66eb597a="">
										<div data-v-66eb597a="" style="display: flex;"><!----></div>
										<div data-v-66eb597a="" style="display: flex;"><!---->
											<p data-v-66eb597a="" class="t-content-p startTime">11-12 18:00 前</p>
											<p data-v-66eb597a="" class="t-content-p" style="color:#ad58eb ;">免费取消
											</p>
										</div>
										<div data-v-66eb597a="" style="display: flex;"><!---->
											<p data-v-66eb597a="" class="t-content-p endTime">11-12 18:00 后</p>
											<p data-v-66eb597a="" class="t-content-p" style="">不可取消</p>
										</div>
									</div>
								</div>
							</div>
						</div>
					</section>
					<!--发票-->
					<h2 data-v-7a97a6d4="" class="mb-3" style="margin-top: 60px;">发票</h2>
					<div class="bookTemp bbl last" data-v-7a97a6d4="">
						<h3 data-v-7a97a6d4="">
							<p class="" data-v-7a97a6d4=""><span class="" data-v-7a97a6d4="">如需发票，请从酒店前台索取</span>
							</p>
						</h3><!---->
					</div>
				</div>
				<!--重新选择房型-->
				<div data-v-7a97a6d4="">
					<div data-v-7a97a6d4=""
						class="text-Color-Uasge-TextIcon-color-brand text-[14px] mb-[24px] flex cursor-pointer mt-[32px]"
						data-events="click">
						<div data-v-7a97a6d4="" class="mr-[4px] text-Color-Uasge-TextIcon-color-brand"
							style="transform: rotate(180deg);"><svg data-v-7a97a6d4=""
								class="svg-icon icon-next next next" style="color: var(--colo);">
								<use xlink:href="#icon-next"></use>
							</svg></div> 重新选择房型
					</div>
				</div>
			</div><!--左侧盒子结束-->
			<!--右侧盒子-->
			<div class="flex flex-col flex-1" style="margin:20px 0px 20px 20px;" data-v-7a97a6d4=""><!--[-->
				<div class="order-price" data-v-7217b067="">
					<!--右侧上方图片加文字部分-->
					<!--图片-->
					<div data-v-872ed92c="" class="flex"><img data-v-872ed92c=""
							class="w-[104px] h-[112px] object-cover"
							src="https://pavo.elongstatic.com/i/mobile220_220/nw_M0ycsLl3K8.jpg" alt="">
						<!--图片右侧文字部分-->
						<div data-v-872ed92c="" class="ml-[12px]">
							<div data-v-872ed92c="" class="mt-[4px] flex flex-nowrap">
								<div data-v-872ed92c="" class="text-[18px] font-[700] truncate w-[210px] hotelName">
									维也纳国际酒店(天津奥体中心凌奥店)</div>
								<div data-v-872ed92c="" class="bg-Color-Uasge-BG-color-page px-[6px] py-[3px]">舒适型
								</div>
							</div>
							<div data-v-872ed92c="" class="text-[14px] font-[500]" id="fangxing">豪华双床房（康莱斯床垫+鹅绒枕）
							</div>
							<div data-v-872ed92c="" class="text-[14px] font-[500]" id="dizhi">南开区凌奥创意产业园内一期管理楼</div>
							<div data-v-872ed92c=""
								class="flex facility items-center flex-wrap mt-[12px] text-Color-Uasge-TextIcon-color-fourthly">
								<!---->
								<div data-v-872ed92c="" class="flex items-center">2张1.35米双人床<div data-v-872ed92c=""
										class="line"></div>
								</div>
								<div data-v-872ed92c="" class="flex items-center">可入住3人<div data-v-872ed92c=""
										class="line"></div>
								</div>
								<div data-v-872ed92c="" class="flex items-center">35m²<div data-v-872ed92c=""
										class="line"></div>
								</div>
								<div data-v-872ed92c="" class="flex items-center">有窗<div data-v-872ed92c=""
										class="line"></div>
								</div>
								<div data-v-872ed92c="" class="flex items-center">允许吸烟<div data-v-872ed92c=""
										class="line"></div>
								</div>
								<div data-v-872ed92c="" class="flex items-center">WIFI免费<!----></div>
							</div>
						</div>
					</div>
					<!--图片下方下划线-->
					<div class="divider my-[24px]" data-v-7217b067=""></div><!----><!---->
					<!--中间模块-->
					<div data-v-7217b067="">
						<!--线上预付模块-->
						<div data-v-340074ea=""
							class="bg-[#FAFAFA] p-[12px] text-Color-Uasge-TextIcon-color-tertiary select-none flex justify-between items-start">
							<div data-v-340074ea="" class="fang_fei">线上预付</div>
							<div data-v-340074ea="" class="flex flex-col items-end">
								<div data-v-340074ea=""
									class="text-Color-Uasge-TextIcon-color-price text-[18px] font-[600] totalPrice">
									¥206</div>
								<!---->
							</div>
						</div>
						<!--房费-->
						<div data-v-340074ea=""
							class="bg-[#FAFAFA] p-[12px] text-Color-Uasge-TextIcon-color-tertiary select-none mt-[12px]">
							<div data-v-340074ea="" class="flex justify-between items-center">
								<div data-v-340074ea="" class="fang_fei">房费</div>
								<div data-v-340074ea="" class="flex flex-col items-end">
									<div data-v-340074ea="" class="cursor-pointer rtPrice" data-events="click">
										1晚￥309
										<!---->
									</div>
								</div>
							</div>
							<div data-v-340074ea="" class="divider"></div>
							<div data-v-340074ea="" class="meal">
								<div data-v-340074ea="" class="flex justify-between">
									<div data-v-340074ea="">2024-11-09 无餐食</div>
									<div data-v-340074ea="" class="every">1 x ¥309</div>
								</div>
								<div data-v-340074ea="" class="flex justify-between">
									<div data-v-340074ea="">2024-11-10 无餐食</div><!---->
								</div>
							</div><!---->
						</div>
						<!--优惠-->
						<div data-v-340074ea=""
							class="mt-[12px] bg-[#FAFAFA] p-[12px] text-Color-Uasge-TextIcon-color-tertiary">
							<div data-v-340074ea="">
								<div data-v-340074ea="" class="flex justify-between items-center">
									<div data-v-340074ea="" class="fang_fei">共计优惠</div>
									<div data-v-340074ea="" class="flex flex-col items-end">
										<div data-v-340074ea="">1晚优惠 -￥0</div>
									</div>
								</div>
							</div>
							<div data-v-340074ea="" class="divider"></div>
							<div data-v-340074ea="" class="flex justify-between">
								<div data-v-340074ea="">学生专享</div>
								<div data-v-340074ea=""><!----> ￥0</div>
							</div>
							<div data-v-340074ea="" class="flex justify-between">
								<div data-v-340074ea="">平台优惠</div>
								<div data-v-340074ea=""><!----> ￥0</div>
							</div>
						</div><!---->
						<div data-v-340074ea="" class="bg-[#FAFAFA] p-[12px] text-Color-Uasge-TextIcon-color-tertiary">
							<div data-v-340074ea="" class="flex justify-between items-center">
								<div data-v-340074ea="" class="fang_fei">离店可享</div><!---->
							</div>
							<div data-v-340074ea="" class="divider"></div><!---->
							<div data-v-340074ea="" class="flex justify-between">
								<div data-v-340074ea="">赠送里程</div>
								<div data-v-340074ea="">1.2倍</div>
							</div>
						</div>
					</div>
				</div><!----><!----><!--]-->
				<!--支付-->
				<div data-v-7b1cfb54="" data-v-7a97a6d4="" class="confirmBox" id="zhifuBox">
					<!--仔细阅读打勾选框-->
					<div data-v-7b1cfb54="" class="checkRule" data-events="click">
						<div data-v-7b1cfb54="" class="">
							<input type="checkbox" class="fuxuankuang">
							<!-- <svg data-v-7b1cfb54=""
								class="svg-icon icon-book_confirmed" style="width: 10px; height: 10px;">
								<use xlink:href="#icon-book_confirmed"></use>
							</svg> -->
						</div>
						<!--文字内容-->
						<p data-v-7b1cfb54="">请您在提交订单前仔细阅读 <a data-v-7b1cfb54="" href="#" target="_blank"
								style="color:#ad58eb ;">《避风港旅行酒店服务条款》</a>和<a data-v-7b1cfb54=""
								href="https://mp.elong.com/tenthousandaura/?activitycode=0a6a86f9-01eb-48d6-befd-d9b5458e217a&amp;isSocket=HotelActivityId_8771"
								target="_blank" style="color:#ad58eb ;">《个人信息授权声明》</a><!----></p>
					</div>
					<!--去支付-->
					<div data-v-7b1cfb54="" data-events="click" class="button robbery"><a class="pay"
							style="color: #fff;">去支付</a></div>
				</div><!---->
			</div>
			<!--选择常住旅客-->
			<div data-v-c61a1ccf="" data-v-7a97a6d4="" class="contactBox ihotel"
				style="position: absolute; top: 0px; left: 0px; z-index: 1; display: none;">
				<div data-v-c61a1ccf="" class="title">请选择常旅客</div>
				<div data-v-c61a1ccf="" class="ul">
					<div data-v-c61a1ccf="" class="li" data-events="click" title="姚从英">姚从英</div>
				</div>
			</div><!----><!----><!--]--><!---->
		</div>

		<!-- 页面尾部开始 -->
		<footer class="footer-wrap">
			<div class="footer-top">
				<div class="container">
					<div class="row ptb-60">
						<div class="col-xl-4 col-lg-4 col-md-6 col-sm-6 pe-xl-5">
							<div class="footer-widget">
								<a href="#" class="footer-logo">
									<img src="static/picture/logo-dark.png" alt="Image">
								</a>
								<p class="comp-desc">
									让旅行净化心灵
								</p>
								<div class="newsletter-form contact-form">
									<form class="subscribe__form" action="mail.php" method="post">

										<!-- <div class="col-12">
		                                        <input type="email" placeholder="Email Address" required="">
		                                    </div>
		
		                                    <div class="col-12">
		                                        <button type="submit">Subscribe Now</button>
		                                    </div> -->

										<!-- Start Form Message -->
										<div class="col-12">
											<div class="msg_submit text-center alert alert-success successform subscribe__msg"
												role="alert">
												Your subscribe was sent successfully.
											</div>
										</div>
										<!-- End Form Message -->

									</form>
								</div>
							</div>
						</div>
						<div class="col-xl-3 col-lg-3 col-md-6 col-sm-6 ps-xl-5 ps-lg-4 ps-md-5">
							<div class="footer-widget">
								<h3 class="footer-widget-title">关于我们</h3>
								<ul class="footer-menu list-style">
									<li>
										<a>
											网页简介
										</a>
									</li>
									<li>
										<a>
											可信网站
										</a>
									</li>
									<li>
										<a>
											网站地图
										</a>
									</li>
									<li>
										<a>
											业务资质
										</a>
									</li>
									<li>
										<a>
											意见反馈
										</a>
									</li>
									<li>
										<a>
											用户协议
										</a>
									</li>
								</ul>
							</div>
						</div>
						<div class="col-xl-2 col-lg-2 col-md-6 col-sm-6">
							<div class="footer-widget">
								<h3 class="footer-widget-title">加盟合作</h3>
								<ul class="footer-menu list-style">
									<li>
										<a href="#">
											合作加盟
										</a>
									</li>
									<li>
										<a href="#">
											商旅合作
										</a>
									</li>
									<li>
										<a href="#">
											旅游保险
										</a>
									</li>
									<li>
										<a href="#">
											网站联盟
										</a>
									</li>
									<li>
										<a href="#">
											门票合作
										</a>
									</li>
									<li>
										<a href="#">
											机票合作
										</a>
									</li>
								</ul>
							</div>
						</div>
						<div class="col-xl-3 col-lg-3 col-md-6 col-sm-6 ps-md-5">
							<div class="footer-widget">
								<h3 class="footer-widget-title">联系我们</h3>
								<ul class="contact-info list-style">
									<li>
										<i class="bx bx-location-plus"></i>
										<h6>地址</h6>
										<p>天河数字产业园四号楼</p>
									</li>
									<li>
										<i class="bx bx-envelope"></i>
										<h6>邮件</h6>
										<a href="#">hello@example.com</a>
									</li>
									<li>
										<i class="bx bx-phone-call"></i>
										<h6>热线</h6>
										<a href="tel:+12345678999">+12 345 678 999</a>
									</li>
								</ul>
							</div>
						</div>
					</div>
				</div>
			</div>
			<div class="footer-bottom">
				<div class="container">
					<div class="row align-items-center">
						<div class="col-lg-8 col-md-6 col-sm-7">
							<p class="copyright-text">Copyright &copy; 2024.Company name All rights reserved.</p>
						</div>
						<div class="col-lg-4 col-md-6 col-sm-5">
							<ul class="social-profile style1 list-style">
								<li>
									<a href="#">
										<i class="ri-facebook-fill"></i>
									</a>
								</li>
								<li>
									<a href="#">
										<i class="ri-twitter-fill"></i>
									</a>
								</li>
								<li>
									<a href="#">
										<i class="ri-instagram-line"></i>
									</a>
								</li>
								<li>
									<a href="#">
										<i class="ri-linkedin-fill"></i>
									</a>
								</li>
							</ul>
						</div>
					</div>
				</div>
			</div>
		</footer>
	</div>

	<!-- 导航条 -->
	<script src="static/js/jquery.min.js"></script>
	<script src="static/js/bootstrap.bundle.min.js"></script>
	<script src="static/js/aos.js"></script>
	<script src="static/js/owl.carousel.min.js"></script>
	<script src="static/js/owl-thumb.min.js"></script>
	<script src="static/js/odometer.js"></script>
	<script src="static/js/fancybox.js"></script>
	<script src="static/js/magnific-popup.min.js"></script>
	<script src="static/js/slick.min.js"></script>
	<script src="static/js/jquery.appear.js"></script>
	<script src="static/js/main.js"></script>
	<script src="static/js/yhs/reserve.js"></script>
	<script>
		$(function () {
			$('.nav-item').click(function () {
				$(this).children().addClass('active');
				$(this).siblings('li').children().removeClass('active')
			})
		})



		//添加登录
		window.onload = function () {
			var nickname = sessionStorage.getItem("nickname");

			if (nickname) {
				// 如果有昵称，替换登录注册的链接
				document.querySelector('.user-account').innerHTML = `
			            <span>Hello! ${nickname}</span>/
			            <a href="#" id="logout">退出登录</a>
			        `;

				// 添加点击事件来处理退出登录
				document.getElementById('logout').addEventListener('click', function (event) {
					event.preventDefault(); // 阻止默认的链接跳转
					sessionStorage.removeItem("nickname"); // 清除昵称
					window.location.href = "login.html"; // 跳转到登录页面
				});
			}

		};
	</script>
</body>

</html>